Skip to content

keep the query column visible when scrolling the details table - #1462

Merged
alexey-milovidov merged 1 commit into
ClickHouse:mainfrom
toschmidt:schmidt/querynames-horizontal
Aug 29, 2026
Merged

keep the query column visible when scrolling the details table#1462
alexey-milovidov merged 1 commit into
ClickHouse:mainfrom
toschmidt:schmidt/querynames-horizontal

Conversation

@toschmidt

Copy link
Copy Markdown
Contributor

The detailed comparison table is wider than the screen, so scrolling right used to move the query checkbox and the query number out of view, leaving no way to tell which query a row belongs to.

The detailed comparison table is wider than the screen, so scrolling right
used to move the query checkbox and the query number out of view, leaving no
way to tell which query a row belongs to.

Make that column sticky. The checkbox and the query number now share a single
cell so a plain `left: 0` is enough — with two cells the second one would need
its offset measured at runtime. Two details keep the scrolled cells from
showing through around the sticky one: an outline covers the table's 1px
border-spacing, and a pseudo-element covers the body padding to its left. The
query number is padded to a fixed width so the checkboxes line up for Q0..Q9
as well, and it keeps its own element so the tooltip still hangs off the name
rather than off the whole cell.

Toggling a query used to re-render only the summary, leaving the detailed
table sorted by the previous ranking; re-render both.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
@toschmidt
toschmidt force-pushed the schmidt/querynames-horizontal branch from 1ed416b to 6bfdcae Compare August 18, 2026 21:55
@toschmidt

Copy link
Copy Markdown
Contributor Author

@alexey-milovidov can you take a look at this?

@alexey-milovidov alexey-milovidov self-assigned this Aug 29, 2026
Comment thread index.html
outline: 1px solid var(--background-color);
}

#details .details-query::before {

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Checked. Works great!

@alexey-milovidov
alexey-milovidov merged commit 6e7260d into ClickHouse:main Aug 29, 2026
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants